import * as echarts from '../../utils/echarts';

let chart = null;

function initChart(canvas, width, height) {
  chart = echarts.init(canvas, null, {    // width,height : 宽高
    width: width,
    height: height
  });
  canvas.setChart(chart);

  var option = {
    color: ["#a2d4f7", "#b1dbf8", "#c1e3fa", "#64b8f2","#74bff3"],
 /*    title: {
      text: '设备状态分布',
      subtext: '纯属虚构',
      x: 'center'
    }, */
    tooltip: {
      trigger: 'item',
      formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
   /*  legend: {
      orient: 'vertical',
      left: 'left',
      data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
   
    }, */
    series: [
      {
        name: '访问来源',
        type: 'pie',
        radius: '55%',
        center: ['50%', '35%'],
        label:{
          color:"#000",
        },
       
        data: [
          { value: 335, name: '直接访问' },
          { value: 310, name: '邮件营销' },
          { value: 234, name: '联盟广告' },
          { value: 135, name: '视频广告' },
          { value: 1548, name: '搜索引擎' }
        ],
        itemStyle: {
          emphasis: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      }
    ]
  };


  chart.setOption(option);
  return chart;
}

Page({
  onShareAppMessage: function (res) {
    return {
      title: 'ECharts 可以在微信小程序中使用啦！',
      path: '/pages/index/index',
      success: function () { },
      fail: function () { }
    }
  },
  data: {
    ec: {
      onInit: initChart
    },

    array: ['日',"周", '月', '季', '年'],
    objectArray: [
      {
        id: 0,
        name: '日'
      },
      {
        id: 1,
        name: '周'
      },
      {
        id: 2,
        name: '月'
      },
      {
        id: 3,
        name: '季'
      },
      {
        id: 4,
        name: '年'
      }
    ],
    index: 0,
    multiArray: [['无脊柱动物', '脊柱动物'], ['扁性动物', '线形动物', '环节动物', '软体动物', '节肢动物']],
    objectMultiArray: [
      [
        {
          id: 0,
          name: '无脊柱动物'
        },
        {
          id: 1,
          name: '脊柱动物'
        }
      ], [
        {
          id: 0,
          name: '扁性动物'
        },
        {
          id: 1,
          name: '线形动物'
        },
        {
          id: 2,
          name: '环节动物'
        },
        {
          id: 3,
          name: '软体动物'
        },
        {
          id: 3,
          name: '节肢动物'
        }
      ], /* [
        {
          id: 0,
          name: '猪肉绦虫'
        },
        {
          id: 1,
          name: '吸血虫'
        }
      ] */
    ],
    multiIndex: [0, 0, 0],
    date: '2016-09-01',
 
  },
    

  bindDateChange: function (e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      date: e.detail.value
    })
  },
 

  bindPickerChange: function (e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      index: e.detail.value
    })
  },
  bindMultiPickerChange: function (e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      multiIndex: e.detail.value
    })
  },

  bindMultiPickerColumnChange: function (e) {
    console.log('修改的列为', e.detail.column, '，值为', e.detail.value);
    var data = {
      multiArray: this.data.multiArray,
      multiIndex: this.data.multiIndex
    };
    data.multiIndex[e.detail.column] = e.detail.value;
    switch (e.detail.column) {
      case 0:
        switch (data.multiIndex[0]) {
          case 0:
            data.multiArray[1] = ['扁性动物', '线形动物', '环节动物', '软体动物', '节肢动物'];
          /*   data.multiArray[2] = ['猪肉绦虫', '吸血虫']; */
            break;
          case 1:
            data.multiArray[1] = ['鱼', '两栖动物', '爬行动物'];
          /*   data.multiArray[2] = ['鲫鱼', '带鱼']; */
            break;
        }
        data.multiIndex[1] = 0;
      /*   data.multiIndex[2] = 0; */
        break;
    /*   case 1:
        switch (data.multiIndex[0]) {
          case 0:
            switch (data.multiIndex[1]) {
              case 0:
                data.multiArray[2] = ['猪肉绦虫', '吸血虫'];
                break;
              case 1:
                data.multiArray[2] = ['蛔虫'];
                break;
              case 2:
                data.multiArray[2] = ['蚂蚁', '蚂蟥'];
                break;
              case 3:
                data.multiArray[2] = ['河蚌', '蜗牛', '蛞蝓'];
                break;
              case 4:
                data.multiArray[2] = ['昆虫', '甲壳动物', '蛛形动物', '多足动物'];
                break;
            }
            break;
          case 1:
            switch (data.multiIndex[1]) {
              case 0:
                data.multiArray[2] = ['鲫鱼', '带鱼'];
                break;
              case 1:
                data.multiArray[2] = ['青蛙', '娃娃鱼'];
                break;
              case 2:
                data.multiArray[2] = ['蜥蜴', '龟', '壁虎'];
                break;
            }
            break;
        }
        data.multiIndex[2] = 0;
        console.log(data.multiIndex);
        break; */
    }
    this.setData(data);
  },
    //搜索
     searchs:function(){
       wx.showToast({
         title: '正在搜索...',
         icon: 'success',
         duration: 2000
       })
     },






  onLoad: function (options){
    this.setData({
      ec: {
        onInit: initChart,

        text1: data.datas[0] ,
        text2: data.datas[1] ,
        text3: data.datas[2] 


      }
   
    })

      


  },




  onShow(){

    this.setData({
      ec: {
        onInit: initChart
      }
    })
  },



  onReady() {

    this.setData({
      ec: {
        onInit: initChart
      }
    })
    console.log(this.data.ec)
    setTimeout(function () {
      // 获取 chart 实例的方式
      console.log(chart)
    }, 2000);
  }
});
